<template>
	<div class="home">
		<div style="width: 90%;margin: auto;">
			<Carousel autoplay v-model="value1" height="400px">
				<CarouselItem>
					<div class="demo-carousel">
						<img style="width:100%"  src="../assets/tu1.jpg">
					</div>
				</CarouselItem>
				<CarouselItem>
					<div class="demo-carousel"><img style="width:100%"  src="../assets/tu1.jpg"></div>
				</CarouselItem>
				<CarouselItem>
					<div class="demo-carousel"><img style="width:100%"  src="../assets/tu1.jpg"></div>
				</CarouselItem>
				<CarouselItem>
					<div class="demo-carousel"><img style="width:100%" src="../assets/tu1.jpg"></div>
				</CarouselItem>
			</Carousel>
		</div>

		<div style="width: 300px;margin: auto;margin-top: 40px;">
			<Divider>热门职位</Divider>
		</div>
		<div>
			<Row>
				<Col span="7" offset="1" style="margin-top: 20px;">
				<Card>
					<p slot="title" style="">产品经理<span class="card_price">5K-8K</span></p>
					<p>Content of card</p>
					<p>Content of card</p>
					<p>Content of card</p>
				</Card>
				</Col>

				<Col span="7" offset="1" style="margin-top: 20px;">
				<Card>
					<p slot="title" style="">产品经理<span class="card_price">5K-8K</span></p>
					<p>Content of card</p>
					<p>Content of card</p>
					<p>Content of card</p>
				</Card>
				</Col>
				<Col span="7" offset="1" style="margin-top: 20px;">
				<Card>
					<p slot="title" style="">产品经理<span class="card_price">5K-8K</span></p>
					<p>Content of card</p>
					<p>Content of card</p>
					<p>Content of card</p>
				</Card>
				</Col>
				<Col span="7" offset="1" style="margin-top: 20px;">
				<Card>
					<p slot="title" style="">产品经理<span class="card_price">5K-8K</span></p>
					<p>Content of card</p>
					<p>Content of card</p>
					<p>Content of card</p>
				</Card>
				</Col>
				<Col span="7" offset="1" style="margin-top: 20px;">
				<Card>
					<p slot="title" style="">产品经理<span class="card_price">5K-8K</span></p>
					<p>Content of card</p>
					<p>Content of card</p>
					<p>Content of card</p>
				</Card>
				</Col>
			</Row>
		</div>
	</div>
</template>

<script lang="ts">
	export default {
		data() {
			return {
				value2: 0
			}
		},
		mounted(){
			this.http.get('/index'
			).then((res) => {
			  console.log(res);
			  
			}).catch((err) => {
			  console.log('failed', err);
			});
		}
		
	}
</script>
<style scoped="scoped">
	.home {
		width: 75%;
		margin: auto;
	}

	.card_price {
		float: right;
		color: #f5070799;
		margin-right: 20px;

	}
</style>
